<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>排行榜</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
</head>
<body>

<form class="layui-form" action="">
<div class="layui-form-item">
    <label class="layui-form-label">比赛名称</label>
    <div class="layui-input-block">
        <select name="mname" id="zero" lay-verify="required" lay-filter="mPlayer">
            <option value=""></option>
        </select>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">比赛场次</label>
        <div class="layui-input-block">
            <select name="roundNum" id="first" lay-verify="required" lay-filter="aPlayer">
                <option value=""></option>
            </select>
        </div>
    </div>
</div>
<div class="layui-form-item">
    <div class="layui-input-block">
        <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
</div>
</form>
<table id="demo" lay-filter="test"></table>
<script src="/static/layui/layui.js"></script>
<script th:src="@{../static/js/eleDel.js}" type="text/javascript"></script>
<script th:src="@{../static/mysource/js/jquery-3.3.1.min.js}"></script>
<script>
    layui.use(['form','table'], function () {
        var table = layui.table;
        var form = layui.form;
        $.ajax({
            url: '/game/gameInfo?isAll=1',
            dataType: 'json',
            type: 'get',
            success: function (data) {
                console.log(data);//下面会提到这个data是什么值
                //使用循环遍历，给下拉列表赋值
                $.each(data.data, function (index, value) {
                    // console.log(value.department_id);
                    $('#zero').append(new Option(value.mname,value.match_id));// 下拉菜单里添加元素
                });
                layui.form.render("select");//重新渲染 固定写法

            }
        })






        //第一个实例
        table.render({
            elem: '#demo'
            // ,height: 312
            , url: '/score/ranking' //数据接口
            , toolbar: '#toolbarDemo'//开启自定义工具行，指向自定义工具栏模板选择器
            , skin: 'line' //表格风格
            , cols: [
                [//表头
                    // {types: 'numbers', title: '排名', width: 180 }
                    {field: 'player_id', title: '选手ID',name:'player_id'},
                    {field: 'mname', title: '大赛名称'}
                    , {field: 'username', title: '选手姓名'}
                    , {field: 'roundNum', title: '比赛场次',name:'roundNum'}
                    , {field: 'judges_scoring', title: '评委打分'}
                    , {field: 'votes', title: '获得票数'}
                    , {field: 'total_score', title: '总成绩'}

                ]
            ]
        });
        var gid = null;
        // form.on('select(mPlayer)', function (data) {        //对应lay-filter
        //
        //     gid = data.value;//获取value值
        // });
        form.on('select(mPlayer)', function (data) {        //对应lay-filter
            gid = data.value;//获取value值
            $.ajax({
                url: '/match/maxRoundNum/'+gid,
                dataType: 'json',
                type: 'get',
                success: function (data) {
                    console.log(data.user);
                    var lenth = data.user//下面会提到这个data是什么值
                    //使用循环遍历，给下拉列表赋值
                    $('#first').empty();

                    for(var i = 1;i<=lenth;i++){
                        var num = i
                        $('#first').append("<option value=" +i + ">" + i + "</option>");
                    }
                    $('#first').val('');
                    layui.form.render("select");//重新渲染 固定写法
                }
            })
            return false;
        });









        //提交事件
        form.on('submit(formDemo)', function (data) {
            console.log(data)
            var  roundNum = $("[name='roundNum']").val();

            table.render({
                elem: '#demo'
                // ,height: 312
                , url: '/score/ranking2?gid='+gid+'&roundNum='+roundNum //数据接口
                ,data:{"gid":gid,"roundNum":roundNum}
                , toolbar: '#toolbarDemo'//开启自定义工具行，指向自定义工具栏模板选择器
                , skin: 'line' //表格风格
                , cols: [
                    [//表头
                        // {types: 'numbers', title: '排名', width: 180 }
                        {field: 'player_id', title: '选手ID'},
                        {field: 'mname', title: '大赛名称'}
                        , {field: 'username', title: '选手姓名'}
                        , {field: 'roundNum', title: '比赛场次'}
                        , {field: 'judges_scoring', title: '评委打分'}
                        , {field: 'votes', title: '获得票数'}
                        , {field: 'total_score', title: '总成绩'}

                    ]
                ]
            });
            return false;
        });

    });
</script>
</body>
</html>